<template>
  <div>
    <el-form :model="Funs" ref="Funs" label-width="150px" class="demo-ruleForm form">
      <el-form-item :label="value" prop="Privileged" v-for="(key, value) in Funs" :key="value" class="item">
        <el-switch v-model="Funs[value]"></el-switch>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data () {
    return {
      Funs: {
        AUDIT_WRITE: true,
        CHOWN: true,
        DAC_OVERRIDE: true,
        FOWNER: true,
        FSETID: true,
        KILL: true,
        MKNOD: true,
        NET_BIND_SERVICE: true,
        NET_RAW: true,
        SETFCAP: true,
        SETGID: true,
        SETPCAP: true,
        SETUID: true,
        SYS_CHROOT: true,
        AUDIT_CONTROL: false,
        BLOCK_SUSPEND: false,
        DAC_READ_SEARCH: false,
        IPC_LOCK: false,
        IPC_OWNER: false,
        LEASE: false,
        LINUX_IMMUTABLE: false,
        MAC_ADMIN: false,
        MAC_OVERRIDE: false,
        NET_ADMIN: false,
        NET_BROADCAST: false,
        SYSLOG: false,
        SYS_ADMIN: false,
        SYS_BOOT: false,
        SYS_MODULE: false,
        SYS_NICE: false,
        SYS_PACCT: false,
        SYS_PTRACE: false,
        SYS_RAWIO: false,
        SYS_RESOURCE: false,
        SYS_TIME: false,
        SYS_TTY_CONFIG: false,
        WAKE_ALARM: false
      }
    }
  },
  watch: {
    // 监听vuex中是isupload是否变化为true，true则上传本组件的数据。
    '$store.state.isUpload': function () {
      if (this.$store.state.isUpload) {
        this.$store.commit('changeCrateData', ['Funs', this.Funs])
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.form{
  display: flex;
  flex-wrap: wrap;
}
.item{
  width: 33%;
  flex-shrink: 0;
}
</style>
